import React, { useEffect, useState } from 'react'
import{Button, Space, Table} from 'antd'
import axios from 'axios'

import dayjs from 'dayjs'
import {useNavigate}from 'react-router-dom'
import UpdateActon from './Acton'
import FeachLend from './FeactLend'
import ClearLend from './ClearLend'
export default function ServerMoint() {

const naviage =useNavigate()

  const [data,setdata]=useState([])
  const [latstlend ,setlatstlend]=useState("")
  useEffect(()=>{
    axios.get('http://43.134.189.46:300/xiaolu/tan').then(res=>{
      setdata(res.data)

    })},[])

//获取客户数据
    const Userlist = ()=>{
      axios.get('http://43.134.189.46:300/xiaolu/tan').then(res=>{
        setdata(res.data)
      })}
      //获取托管用户数据
      const Trusteeship = ()=>{
        axios.get('http://43.134.189.46:300/xiaolu/tantrust').then(res=>{
          setdata(res.data)
        })
    }
    const columns = [
      {
        title: 'id',
        dataIndex: 'id',
        key: 'id',
      },
      {
          title: '姓名',
          dataIndex: 'name',
          key: 'name',
        },
        {
          title: '状态',
          dataIndex: 'status',
          key: 'status',
        },
        {
          title: '开机时间',
          dataIndex: 'startup',
          key: 'startup',
        },

      {
        title: '提交时间',
        dataIndex: 'time',
        key: 'time',
        render: (time: any) => {
          return dayjs(time).format("YYYY-MM-DD HH");
        },

      },
      // {
      //   title: '节点时间',
      //   dataIndex: 'node',
      //   key: 'node',
      // },
      {
        title: '远程码',
        dataIndex: 'ycm',
        key: 'ycm',
      },
      {
        title: '备注',
        dataIndex: 'bz',
        key: 'bz',
      },
      {
        title: '分组',
        dataIndex: 'colum',
        key: 'colum',
      },
      {
        title: '区块高度',
        dataIndex: 'lend',
        key: 'lend',
      },
      {
        title: '容器状态',
        dataIndex: 'switc',
        key: 'switc',
      },
      {
          title: '操作',
          dataIndex: 'action',
          key: 'action',
          render: (_,datatype) => {
             return (
              <>
              <Space>
              <FeachLend name={datatype.name}></FeachLend>
              <UpdateActon name={datatype.name}></UpdateActon>
              <ClearLend name={datatype.name}></ClearLend>
              </Space>
              </>
             )
          }


        },
    ];
    const monit =()=>{
      naviage('/')
    }
    useEffect(()=>{
      const  reloadsent = setInterval(()=>{
        window.location.reload();
      },60000)
      return ()=>{
        clearInterval(reloadsent)
      }
    })
    const getlastelend =()=>{
      axios.get('http://43.134.189.46:300/gf').then(res=>{
        setlatstlend(res.data)
      })

    }
  return (
    <div>
      <h1 style={{textAlign:"center"}}>谭客户</h1>
      <div>
      <Space>
        <Button type="primary" onClick={Userlist}>客户</Button>
        <Button type="primary" onClick={Trusteeship}>托管</Button>
        <Button type="primary" onClick={monit}>监控面板</Button>
        <Button type="primary" onClick={getlastelend}>最新区块高度</Button>

        </Space>

      </div>

      <div>
      <div>
        <h1 style={{textAlign:'center'}}>{latstlend}</h1>
        </div>
        <Table columns={columns} dataSource={data}></Table>
      </div>
    </div>

  )
  }
